﻿@model Matrix.MaKaYunShang.Model.DataStatisticsModels.BaseDataStatOrderDetail
@{
    ViewBag.Title = "销售统计报表";
    ViewBag.PathToBtn = "/GfcStat/SalesStatisticsList";
    ViewBag.TextBtn = "刷新";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section css{
    <style type="text/css">
        .nav-tabs li {
            cursor: pointer;
        }

        .table hr {
            margin: 5px 0;
            border: dashed 1px #aaa;
        }

        #TransferShopModal {
            top: 20%;
        }
    </style>
}
<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <form>
                    &nbsp;<input type="checkbox" id="isGroupbyShop" name="isGroupbyShop" class="form-control" style="width: 15px; height:15px; display: inline-block" />
                    &nbsp;是否按店铺分组
                    &nbsp;<input type="checkbox" id="isGroupByCommodity" name="isGroupByCommodity" class="form-control" style="width: 15px; height:15px; display: inline-block" />
                    &nbsp;是否分商品查询
                    &nbsp;<input type="checkbox" id="isGroupByPayWay" class="form-control" name="isGroupByPayWay" style="width: 15px; height:15px; display: inline-block" />
                    &nbsp; 是否按支付方式分组
                    &nbsp;<input type="checkbox" id="isGroupByConsumer" class="form-control" name="isGroupByConsumer" style="width: 15px; height:15px; display: inline-block" />
                    &nbsp; 是否分用户查询
                    &nbsp; <input type="checkbox" id="isGroupByDeliveryAccount" class="form-control" name="isGroupByDeliveryAccount" style="width: 15px; height:15px; display: inline-block" /> &nbsp;&nbsp;是否分配送人员查询

                   &nbsp;销售时间：<input type="text" class="form-control input-sm form_datetime_order_search" placeholder="开始时间" style="width: 110px;display: inline-block" id="dtBeginTime" name="dtBeginTime" />
                    --
                    <input type="text" class="form-control input-sm form_datetime_order_search" placeholder="结束时间" style="width: 110px;display: inline-block" id="dtEndTime" name="dtEndTime" />
                    客户名称:&nbsp;&nbsp;<input type="text" class="form-control input-sm" id="consumerName" name="consumerName" style="width: 110px;display: inline-block" />
                    <br /><br />
                    <div style=" width:200px; float:left">
                        店铺：
                        <input type="text" data-target='#TransferShopModal' data-toggle='modal'  class="form-control input-sm" placeholder="店铺名称" style="width: 150px;display: inline-block" id="shopName" />
                        <input type="text" id="ShopId" name="ShopId" style=" display:none" />
                    </div>
                    &nbsp;
                    时间条件:
                    <select id="queryDateType" name="queryDateType" class="form-control input-sm" style=" width: 140px; display: inline-block">
                        <option value="0">按日统计</option>
                        <option value="1">按周统计</option>
                        <option value="2">按月统计</option>
                        <option value="3">按年统计</option>
                    </select>
                    &nbsp;&nbsp;
                    支付方式:
                    <select id="orderPayWay" name="orderPayWay" class="form-control input-sm" style=" width: 140px; display: inline-block">
                        <option value="">全部</option>
                        <option value="0">微信支付</option>
                        <option value="1">纸质水票支付</option>
                        <option value="2">现金支付</option>
                        <option value="3">电子水票</option>
                    </select>
                    &nbsp;&nbsp;商品名称: &nbsp;&nbsp;<input type="text" data-target='#TransferCommodityLibModal' data-toggle='modal' class="form-control input-sm" id="commodityName" name="commodityName" style="width: 110px;display: inline-block" />
                    &nbsp;&nbsp;商品条形码: &nbsp;&nbsp;<input type="text" class="form-control input-sm" id="commodityBarCode" name="commodityBarCode" style="width: 110px;display: inline-block" />
                    <div style=" width:200px; float:left;display:none" id="consumerNameDiv">
                     &nbsp;&nbsp;配送人员: &nbsp;&nbsp;<input type="text" class="form-control" data-target='#TransferDeliveryAccountModal'  data-toggle='modal' id="deliveryAccountName" name="deliveryAccountName" style="width: 110px; display: inline-block; " />
                        <input type="text" id="deliveryAccountId" name="deliveryAccountId" style=" display:none" />
                    </div>
                    <input type="reset" value="清空条件" class="btn btn-info" style="margin-left: 10px;" />
                    <a class="btn btn-primary pull-right" style="margin-left: 10px;" id="btnExport">导出</a>
                    <a class="btn btn-primary pull-right" id="btnSearch">查询</a>
                </form>
            </div>
        </div>
    </div>

</div>
<div class="row">
    <div class="col-lg-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                订单详情
            </div>
            <div class="panel-body">
                <div class="dataTable_wrapper">
                    <table width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example">
                        <thead>
                            <tr>
                                <th>店铺名称</th>
                                <th>商品名称</th>
                                <th>商品条形码</th>
                                <th>统计时间</th>
                                <th>商品出售量</th>
                                <th>商品单价</th>
                                <th>支付方式</th>
                                <th>商品出售总额</th>
                                <th>售卖方式</th>
                                <th>客户名称</th>
                                <th>配送人员</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="TransferShopModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="max-width: 500px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">查询店铺（<font color="red">仅显示已激活的店铺</font>）</h4>
            </div>
            <div class="modal-body">
                <div style="margin-bottom: 5px;">
                    <input type="text" class="form-control" placeholder="店铺名称" style="width: 409px;display: inline-block" id="shopKeyWords" />
                    <a class="btn btn-primary" onclick="searchShops();">查询</a>
                </div>
                <div class="table-responsive table-bordered" style="max-height: 250px;">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>店铺名称</th>
                                <th>距离用户（米）</th>
                                <th style="text-align: center">操作</th>
                            </tr>
                        </thead>
                        <tbody id="shopsData"></tbody>
                    </table>
                    <input type="hidden" id="hidOrderId" />
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="TransferCommodityLibModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="max-width: 500px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">查询商品</h4>
            </div>
            <div class="modal-body">
                <div style="margin-bottom: 5px;">
                    <input type="text" class="form-control" placeholder="商品名称" style="width: 409px;display: inline-block" id="CommodityLibKeyWords" />
                    <a class="btn btn-primary" onclick="searchCommodityLib();">查询</a>
                </div>
                <div class="table-responsive table-bordered" style="max-height: 250px;">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>商品名称</th>
                                <th>品牌</th>
                                <th style="text-align: center">操作</th>
                            </tr>
                        </thead>
                        <tbody id="CommodityLibData"></tbody>
                    </table>
                    <input type="hidden" id="hidOrderId" />
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="TransferDeliveryAccountModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="max-width: 500px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">查询配送人员</h4>
            </div>
            <div class="modal-body">
                <div style="margin-bottom: 5px;">
                    <input type="text" class="form-control" placeholder="配送人员名称" style="width: 409px;display: inline-block" id="DeliveryAccountKeyWords" />
                    <a class="btn btn-primary" onclick="searchDeliveryAccount();">查询</a>
                </div>
                <div class="table-responsive table-bordered" style="max-height: 250px;">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>配送人员昵称</th>
                                <th>电话</th>
                                <th style="text-align: center">操作</th>
                            </tr>
                        </thead>
                        <tbody id="DeliveryAccountData"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<iframe id="exportOrderFrame" style="display:none "></iframe>
@section javascript{
    <script src="~/Content/admin/dist/js/pagingHelper.js"></script>
    <script type="text/javascript">
        var dataParams = {};
        var serverProcessPath = "/GfcStat/SalesStatisticsListing";
        var showColumns = [
            { data: "ShopName" },
            { data: "CommodityName" },
            { data: "CommodityBarCode" },
            { data: "OrderDate" },
            { data: "CommoditySoldCount" },
            { data: "UnitPrice" },
            { data: "PayWayDesc" },
            { data: "TotalIncome" },
            { data: "SellingWay" },
            { data: "ConsumerName" },
            { data: "DisplayName" }
        ];
        pagingHelper.Paging(serverProcessPath, dataParams, showColumns, null, false);
        $("#dataTables-example_wrapper div:first").hide();

        $(function () {
            $('.form_datetime_order_search').datetimepicker({
                format: 'yyyy-mm-dd',
                language: 'zh-CN',
                weekStart: 1,
                todayBtn: 1,
                autoclose: 1,
                todayHighlight: 1,
                startView: 2,
                minView: 2,
                forceParse: 0
            });
            $("#btnSearch").click(function () {
                reloadOrder();
            });

            $("#btnExport").click(function () {
                alertify.okBtn("确定").cancelBtn("取消").confirm("将导出当前搜索条件下的所有数据，确定导出吗（导出时间较长，请耐心等候）？", function () {
                    $.post("@Url.Action("ExportExcelStatShopCommoditySelling")" + "?dtBeginTime=" + $("#dtBeginTime").val() + "&dtEndTime=" + $("#dtEndTime").val() + "&shopId=" + $("#ShopId").val() + "&queryDateType=" + $("#queryDateType").val() + "&isGroupbyShop=" + $("#isGroupbyShop").prop('checked') + "&isGroupByPayWay=" + $("#isGroupByPayWay").prop('checked') + "&isGroupByOrderStatus=" + $("#isGroupByOrderStatus").prop('checked') + "&orderPayWay=" + $("#orderPayWay").val() + "&orderStatus=" + $("#orderStatus").val() + "&isGroupByDeliveryAccount=" + $("#isGroupByDeliveryAccount").prop('checked') + "&isGroupByCommodity=" + $("#isGroupByCommodity").prop('checked') + "&isGroupByConsumer=" + $("#isGroupByConsumer").prop('checked') + "&commodityName=" + $("#commodityName").val() + "&commodityBarCode=" + $("#commodityBarCode").val() + "&consumerName=" + $("#consumerName").val() + "&deliveryAccountId=" + $("#deliveryAccountId").val() + "&consumerName=" + $("#consumerName").val(), {}, function (data) {
                        if (data.Status) {
                            $("#exportOrderFrame").attr("src", data.Message);
                        } else {
                            alertify.alert(data.Message);
                        }
                    });
                });
            });
            searchShops();
            searchCommodityLib();
        });

        function selectShop(shopId, name) {
            $("#ShopId").val(shopId);
            $("#shopName").val(name);
            $("#consumerNameDiv").show();
            $("#TransferShopModal").modal("hide");
            searchDeliveryAccount();
        }

        function searchShops() {
            $("#shopsData").html("");
            $("#ShopId").val("");
            $("#shopName").val("")
            $.post("@Url.Action("GetShopList")", "keyWords=" + encodeURIComponent($("#shopKeyWords").val()), function (data) {
                if (data.Status) {
                    for (var i = 0; i < data.Data.length; i++) {
                        var OrderName = "'" + data.Data[i].Name + "'";
                        $("#shopsData").append("<tr><td>" + data.Data[i].Name + "</td><td>" + data.Data[i].Distance.toFixed(2) + "</td><td align='center'><a class='btn btn-info' onclick=\"selectShop(" + data.Data[i].Id + "," + OrderName.toString() + ");\">选择</a></td></tr>");
                    }
                } else {
                    alertify.alert(data.Message);
                }
            });
        }

        function reloadOrder() {
            pagingHelper.reloadWithDiffPath("@Url.Action("SalesStatisticsListing")" + "?dtBeginTime=" + $("#dtBeginTime").val() + "&dtEndTime=" + $("#dtEndTime").val() + "&shopId=" + $("#ShopId").val() + "&queryDateType=" + $("#queryDateType").val() + "&isGroupbyShop=" + $("#isGroupbyShop").prop('checked') + "&isGroupByPayWay=" + $("#isGroupByPayWay").prop('checked') + "&isGroupByOrderStatus=" + $("#isGroupByOrderStatus").prop('checked') + "&orderPayWay=" + $("#orderPayWay").val() + "&orderStatus=" + $("#orderStatus").val() + "&isGroupByDeliveryAccount=" + $("#isGroupByDeliveryAccount").prop('checked') + "&isGroupByCommodity=" + $("#isGroupByCommodity").prop('checked') + "&isGroupByConsumer=" + $("#isGroupByConsumer").prop('checked') + "&commodityName=" + $("#commodityName").val() + "&commodityBarCode=" + $("#commodityBarCode").val() + "&consumerName=" + $("#consumerName").val() + "&deliveryAccountId=" + $("#deliveryAccountId").val()) + "&consumerName=" + $("#consumerName").val();
        }//consumerName

        //搜索商品
        function searchCommodityLib() {
            $("#CommodityLibData").html("");
            $("#commodityName").val("");
            $("#commodityId").val("");
            $.post("@Url.Action("GetCommodityLibList")", "keyWords=" + encodeURIComponent($("#CommodityLibKeyWords").val()), function (data) {
                if (data.Status) {
                    for (var i = 0; i < data.Data.length; i++) {
                        var commodityName = "'" + data.Data[i].CommodityName + "'";
                        $("#CommodityLibData").append("<tr><td>" + data.Data[i].CommodityName + "</td><td>" + data.Data[i].BrandName + "</td><td align='center'><a class='btn btn-info' onclick=\"selectCommodityName(" + data.Data[i].Id + "," + commodityName.toString() + ");\">选择</a></td></tr>");
                    }
                } else {
                    alertify.alert(data.Message);
                }
            });
        }
        function selectCommodityName(id, commodityName) {
            $("#commodityId").val(id);
            $("#commodityName").val(commodityName);
            $("#TransferCommodityLibModal").modal("hide");
        }

        //搜索配送人员
        function searchDeliveryAccount() {
            $("#DeliveryAccountData").html("");
            $("#deliveryAccountName").val("");
            $("#deliveryAccountId").val("");
            // alert($("#ShopId").val());
            $.post("@Url.Action("GetMcAccountsList", "GfcStat")", "keyWords=" + encodeURIComponent($("#DeliveryAccountKeyWords").val()) + "&shopId=" + $("#ShopId").val(), function (data) {
                if (data.Status) {
                    for (var i = 0; i < data.Data.length; i++) {
                        var DisplayName = "'" + data.Data[i].DisplayName + "'";
                        $("#DeliveryAccountData").append("<tr><td>" + data.Data[i].DisplayName + "</td><td>" + data.Data[i].Mobile + "</td><td align='center'><a class='btn btn-info' onclick=\"selectDeliveryAccountName(" + data.Data[i].Id + "," + DisplayName.toString() + ");\">选择</a></td></tr>");
                    }
                } else {
                    alertify.alert(data.Message);
                }
            });
        }
        function selectDeliveryAccountName(id, commodityName) {
            $("#deliveryAccountId").val(id);
            $("#deliveryAccountName").val(commodityName);
            $("#TransferDeliveryAccountModal").modal("hide");
        }
    </script>
}